import React, { Component } from 'react';
import { Text, View,StyleSheet,Alert,Button,TextInput,Dimensions,Image} from 'react-native';
//导入Action的包,处理页面跳转
import { Actions } from 'react-native-router-flux';
import TabNavigator from 'react-native-tab-navigator';

import Map from '../home/components/map.js'
const width = Dimensions.get('window').width;
export default class BottomTab extends Component {
    constructor(props){
        super(props);
        this.state = {
            selectedTab: 'home'
        }
    }

    render(){
        console.log(Actions,"this.props.navigation")
        return (
            <View style={styles.container}>
                <TabNavigator>
                    <TabNavigator.Item
                                        selected={this.state.selectedTab === 'home'}
                                        title="首页"
                                        selectedTitleStyle={{color:"#FF22BB"}}//设置tab标题颜色
                                       renderIcon={() => <Image style={styles.image} source={require('../../static/images/1.png')} />}
                                       renderSelectedIcon={() => <Image style={styles.image} source={require('../../static/images/2.png')} />}
                                       // badgeText="1"
                                       onPress={() => this.setState({ selectedTab: 'home' })}>
                        <View style={styles.page2}>
                            <Map></Map>
                        </View>
                    </TabNavigator.Item>
                    <TabNavigator.Item  selected={this.state.selectedTab === 'me'}
                                        title="我的"
                                        selectedTitleStyle={{color:"#FF22BB"}}//设置tab标题颜色
                                       renderIcon={() => <Image style={styles.image} source={require('../../static/images/1.png')} />}
                                       renderSelectedIcon={() => <Image style={styles.image} source={require('../../static/images/2.png')} />}
                                       // badgeText="1"
                                       onPress={() => this.setState({ selectedTab: 'me' })}>
                        <Text style={styles.page2}>这里放我的组件</Text>
                    </TabNavigator.Item>
                </TabNavigator>
            </View>

        );
    }
};
const styles = StyleSheet.create({
    container: {
        flex: 1,
        backgroundColor: '#F5FCFF',
    },
    page1: {
        flex: 1,
        backgroundColor: 'red'
    },
    page2: {
        flex: 1,
        backgroundColor: 'yellow'
    },
//   react native里不用写单位
    image: {
        height: 22,
        width: 22
    }
});